<template>
	<view class="column-css">
		<view>
			<block v-for="(item, index) in paylist" :key="index">
				<view style="border-radius: 10rpx;background: #FFFFFF;margin: 10rpx 20rpx;padding: 10rpx 20rpx;">
					<view class="row-css" style="justify-content: space-between;align-items: center;">
						<view class="column-css">
							<view style="color: #999999; font-size: 26rpx;">{{ item.bankName }}  储蓄卡</view>
							<view style="padding: 10rpx 0;font-size: 36rpx;">{{ item.bankNo }}</view>
						</view>
					</view>
				</view>
			</block>
			<view style="padding: 30rpx;color: #D6D6D6;margin: 5rpx 20rpx; background: #FFFFFF;border-radius: 5rpx;" @click="onperfectie">+   添加银行卡</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			paylist: [
				// {
				// 	bankName: '二类卡账户',
				// 	accountNum: '621212121212888'
				// },
				// {
				// 	bankName: '电子卡账户',
				// 	accountNum: '621212121212888'
				// }
			]
		};
	},
	methods: {
		onperfectie: function(payId) {
			uni.navigateTo({
				url: `/pages/personal/perfecttiedcard`
			});
		},
		onbilllist() {
			let driverId = uni.getStorageSync(this.DATA_KEY.userInfo).driverId;
			this.wxRequest({
				url: `${this.API}/mini/jzb/queryBindBankCard`,
				method: 'POST',
				title: '加载中...',
				success: res => {
					this.paylist = res.data.data;
				}
			});
		}
	},
	onLoad() {
		// this.onbilllist();
	},
	onShow() {
		// this.onbilllist();
		let userInfo = uni.getStorageSync(this.DATA_KEY.userInfo);
		this.wxRequest({
			url: `${this.API}/mini/jzb/getCashIdCardInfo?idCard=${userInfo.idcard}`,
			method: 'GET',
			title: '查询中...',
			success: res => {
				console.log(res)
				if (res.data.data && res.data.data.length > 0) {
					let list = res.data.data.map(item => {
						return {
							bankName: item.bankName,
							bankNo: item.cashCard
						}
					})
					this.paylist = list;
				}
			}
		});
	}
};
</script>

<style>
page {
	height: 100%;
}
.row-css {
	display: flex;
	flex-direction: row;
}

.column-css {
	display: flex;
	flex-direction: column;
}
</style>
